<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>数据对比</title>
    <link rel="stylesheet" href="../css/style.default.css">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <link rel="stylesheet" href="../bootstrap-4.6.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/fontastic.css">
    <link rel="stylesheet" href="../css/google-fonts.css">
    <link rel="stylesheet" href="../css/style.default.css" id="theme-stylesheet">
    <link rel="stylesheet" href="../css/custom-pwl.css">
    <link rel="shortcut icon" href="../img/logo.ico">
</head>
<style>
    #main-content {
        padding: 20px;
    }
    .form-group {
        margin-bottom: 20px;
    }
    .form-control {
        width: 100%;
    }
    #compareBtn {
        margin-top: 10px;
    }
</style>
<body>
<!-- 顶部导航-->
<header class="header">
    <nav class="navbar">
        <div class="container-fluid">
            <div class="navbar-holder d-flex align-items-center justify-content-between">

                <div class="navbar-header">
                    <!-- 顶部左侧logo -->
                    <a href="../index.html" class="navbar-brand d-none d-sm-inline-block">
                        <div class="brand-text d-none d-lg-inline-block"><strong>氨基酸数据库</strong></div>
                        <div class="brand-text d-none d-sm-inline-block d-lg-none"><strong>CATD</strong>
                        </div>
                    </a>
                    <!-- 顶部右侧下拉菜单图标-->
                    <a id="toggle-btn" href="#" class="menu-btn active"><span></span><span></span><span></span></a>
                </div>
                <!-- 下拉菜单 -->
                <ul class="nav-menu list-unstyled d-flex flex-md-row align-items-md-center">
                    <li class="nav-item dropdown">
                        <a href="#" class="dropdown-toggle dropdown-user-link" data-toggle="dropdown">
										<span class="dropdown-user-name">
											<i>你好，姓名</i>
										</span>
                        </a>
                        <div class="dropdown-menu pull-right dropdown-menu-bigbox">
                            <div class="dropdown-menu-bigbox-top">
                                <div id="user_name" class="dropdown-menu-bigbox-top-user-name">
                                    <span>姓名</span>
                                </div>
                            </div>
                            <div class="row dropdown-menu-bigbox-bottom">
                                <div class="col-md-6 col-lg-6 col-xs-6 col-sm-6 text-center grid" style="cursor: pointer" onclick="window.location.href='../web/changePwd.html';return false">
                                    <i class="fa fa-key dropdown-menu-bigbox-bottom-icon"
                                       style="font-size: 25px;line-height: 45px;color: #438eb9;"></i>
                                    <p class="dropdown-menu-bigbox-bottom-font">
                                        <span>密码修改</span>
                                    </p>
                                </div>
                            </div>

                            <!--                                <div class="row dropdown-menu-bigbox-bottom">-->
                            <!--                                    <div class="col-md-6 col-lg-6 col-xs-6 col-sm-6 text-center grid">-->
                            <!--                                        <i class="fa fa-comments dropdown-menu-bigbox-bottom-icon"></i>-->
                            <!--                                        <p class="dropdown-menu-bigbox-bottom-font">-->
                            <!--                                            <span>消息</span>-->
                            <!--                                        </p>-->
                            <!--                                    </div>-->
                            <!--                                    <div class="col-md-6 col-lg-6 col-xs-6 col-sm-6 text-center grid">-->
                            <!--                                        <i class="fa fa-heart-o dropdown-menu-bigbox-bottom-icon"></i>-->
                            <!--                                        <p class="dropdown-menu-bigbox-bottom-font">-->
                            <!--                                            <span>帮助中心</span>-->
                            <!--                                        </p>-->
                            <!--                                    </div>-->
                            <!--                                </div>-->


                            <div class="row dropdown-menu-bigbox-exit">
                                <div class="dropdown-menu-bigbox-exit-font">
                                    <a href="login.html" class="nav-link logout"><span>退出登录</span><i
                                            class="fa fa-sign-out"></i></a>
                                </div>
                            </div>
                        </div>

                    </li>

                </ul>
            </div>
        </div>
    </nav>
</header>
<div class=" d-flex align-items-stretch padding-top">
    <!-- 侧边导航栏 -->
    <nav class="side-navbar" id="navbar">
        <ul class="list-unstyled">
            <li ><a href="../index.html"> <i class="icon-home"></i>首页 </a></li>
            <li><a href="addAminoAcid.html" > <i class="icon-grid"></i>氨基酸管理 </a>
            </li>

            <li><a href="#culAminoAcid" data-toggle="collapse" aria-expanded="false" aria-controls="culAminoAcid">
                <i class="fa fa-bar-chart "></i>计算 </a>
                <ul id="culAminoAcid" class="collapse list-unstyled show">
                    <li><a href="culAminoAcid.html">氨基酸计算</a></li>
                    <li class="active"><a href="comparison.html">对比</a></li>
                </ul>
            </li>

            <li>
                <a href="#culResult" data-toggle="collapse" aria-expanded="false" aria-controls="culResult">
                <i class="fa fa-bar-chart"></i> 查看计算结果
                </a>
                <ul id="culResult" class="collapse list-unstyled ">
                    <li><a href="culResult.html">计算结果</a></li>
                    <li><a href="uploadData.html">上传的数据</a></li>
                    <li><a href="comparisonList.html">对比的数据</a></li>
                </ul>
            </li>
        </ul>
    </nav>
    <!-- 网页主体 -->
    <div id="main-content" class="content-inner">
        <h2>数据对比</h2>
        <div class="form-group row">
            <div class="col-md-4">
                <label for="resultName">Result Name:</label>
                <select class="form-control" id="resultName"></select>
            </div>
            <div class="col-md-4">
                <label for="uploadName">Upload Name:</label>
                <select class="form-control" id="uploadName"></select>
            </div>
            <div class="col-md-4">
                <label for="tolerance">容差值:</label>
                <input type="number" class="form-control" id="tolerance" step="0.0001" >
            </div>
            <div class="col-md-3">
                <label for="comparisonName">对比名称:</label>
                <input type="text" class="form-control" id="comparisonName" placeholder="输入本次对比名称">
            </div>
        </div>
        <button id="compareBtn" class="btn btn-primary">开始对比</button>
        <div class="progress mt-3" style="display: none;">
            <div id="progressBar" class="progress-bar" role="progressbar" style="width: 0%;">0%</div>
        </div>
        <footer class="main-footer">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-sm-6">
                        <p>Copyright &copy; 2024. <a
                                href="../index.html" target="_blank" title="CATD">ZWH</a></p>
                    </div>
                    <div class="col-sm-6 text-right">
                        <p></p>
                        <!-- Please do not remove the backlink to us unless you support further theme's development at https://bootstrapious.com/donate. It is part of the license conditions. Thank you for understanding :)-->
                    </div>
                </div>
            </div>
        </footer>
    </div>
</div>
<!-- JavaScript files-->
<script src="../js/jquery-3.6.0.min.js"></script>
<script src="../vendor/popper.js/umd/popper.min.js"> </script>
<script src="../bootstrap-4.6.1-dist/js/bootstrap.min.js"></script>
<script src="../vendor/jquery.cookie/jquery.cookie.js"> </script>
<!-- <script src="https://cdn.bootcss.com/Chart.js/2.7.0/Chart.min.js"></script> -->
<script src="../vendor/jquery-validation/jquery.validate.min.js"></script>

<!--<script src="../js/charts-home.js"></script>-->
<!-- Main File-->
<script src="../js/autosize.js"></script>

<script src="../js/sweetalert-dev.js"></script>

<script src="../js/front.js"></script>
<!--<script src="../js/content-input.js"></script>-->
<script src="../js/diy-auotHeight.js"></script>
<!-- Create Docx-->
<script src="../js/docxtemplater.js" type="text/javascript"></script>
<script src="../js/pizzip.js" type="text/javascript"></script>
<script src="../js/jszip-utils.js" type="text/javascript"></script>
<script src="../js/FileSaver.js" type="text/javascript"></script>
<script src="../js/pizzip-utils.js" type="text/javascript"></script>
<script src="../js/comparison.js"></script>

</body>
</html>
